<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>私信</title>
		<link rel="stylesheet" href="css/index.css" />
		<link rel="stylesheet" href="css/personletter.css" />
		<script src="js/jquery.min.js"></script>
	</head>
	<body style="background: #fff;">
		<!--nav 可复用-->
		<div class="nav">
			<p onclick="javascript:history.back(-1);"><img src="images/箭头2.png" alt="" /></p>
			<p>私信</p>
		</div>
		<!--私信内容-->
		<div class="personletter_content">
			<div class="personletter_content_line1">
				<button class="active">消息</button>
				<button>好友</button>
			</div>
			<div class="personletter_content_1">
				<div class="personletter_content_line2" onclick="javascript:window.location.href='helper.html'">
					<img src="images/私信_08.png" alt="" />
					<p>穆穆助手</p>
					<p>在美好的风景也比不过夕阳下...</p>
				</div>
				<div class="personletter_content_line3" onclick="javascript:window.location.href='chat.html'">
					<img src="images/私信_11.png" alt="" />
					<i>1</i>
					<p>晴天</p>
					<p>2017-01-01&nbsp;15:30</p>
					<p>在吗?</p>
				</div>
				<div class="personletter_content_line3" onclick="javascript:window.location.href='chat.html'">
					<img src="images/私信_11.png" alt="" />
					<p>遇见美好的自己</p>
					<p>2017-07-07&nbsp;16:32</p>
					<p>你好</p>
				</div>
			</div>
			<div class="personletter_content_2">
				<div class="personletter_content_line2" onclick="javascript:window.location.href='helper.html'">
					<img src="images/私信_08.png" alt="" />
					<p>穆穆助手</p>
					<p>在美好的风景也比不过夕阳下...</p>
				</div>
				<div class="personletter_content_line3" onclick="javascript:window.location.href='chat.html'">
					<img src="images/私信_11.png" alt="" />
					<i>1</i>
					<p>阴天</p>
					<p>2017-01-01&nbsp;15:30</p>
					<p>不在哦！</p>
				</div>
				<div class="personletter_content_line3" onclick="javascript:window.location.href='chat.html'">
					<img src="images/私信_11.png" alt="" />
					<p>遇见不太好的自己</p>
					<p>2017-07-07&nbsp;16:32</p>
					<p>你好坏</p>
				</div>
			</div>
		</div>
		<!--bottom 可复用-->
		<div class="mumu_bottom">
			<div class="mumu_bottom_line1" onclick="javascript:window.location.href='index.html'">
				<img src="images/tab4.png" alt="穆穆" />
				<p>穆穆</p>
			</div>
			<div class="mumu_bottom_line1" onclick="javascript:window.location.href='nearby.html'">
				<img src="images/tab3.png" alt="附近" />
				<p>附近</p>
			</div>
			<div class="mumu_bottom_line1 active">
				<img src="images/tab2-1.png" alt="信息" />
				<p>私信</p>
			</div>
			<div class="mumu_bottom_line1" onclick="javascript:window.location.href='dynamic.html'">
				<img src="images/tab5.png" alt="动态" />
				<p>动态</p>
			</div>
			<div class="mumu_bottom_line1" onclick="javascript:window.location.href='my.html'">
				<img src="images/tab1.png" alt="我的" />
				<p>我的</p>
			</div>
		</div>
		<script>
			$(function(){
				$('.personletter_content_line1 button').click(function(){
					var g = $(this).index();
					if(g == 0){
						$('.personletter_content_1').show().next('.personletter_content_2').hide();
					}else if(g == 1){
						$('.personletter_content_2').show().prev('.personletter_content_1').hide();
					}
					$(this).addClass('active').siblings('button').removeClass('active');
				})
			})
		</script>
	</body>
</html>
